<template>
  <div class="summary-container">
    <div class="header">
        <div class="header-title">会议纪要</div>
        <i class="close-icon" @click="closeAndSureBtn('close')"></i>
    </div>
    <div class="summary-content">
        <div class="summary" v-text="summary"></div>
    </div>
    <div class="footer" @click="clickCopy">
        <div class="footer-word">
            <i class="footer-icon"></i>
            一键复制
        </div>
    </div>
  </div>
</template>

<script>
import fun from "../../../util/function";
export default {
    props: {
      roomInfo:Object,  
      videoInfo:Object
    },
    created() {
        if (this.roomInfo) {
            this.summaryList = this.roomInfo.roomInfo?.roomExt2?.tcSummaryList
            console.log("我在直播间", this.summaryList);//roomExt2
        } else {
            this.summaryList = this.videoInfo.videoInfo?.roomVideoExt2?.tcSummaryList
            console.log("我在回放", this.summaryList);
        }
        this.getSummaryText()
    },
    data() {
        return {
            summary:'',
            summaryList:[]
        }
    },
    methods: {
        closeAndSureBtn(type) {
            this.$emit("formChildMsg", {
                type: "closeVantPopup",
            });
        },
        clickCopy() {
            fun.copyTxt(this.summary, () => {
                fun.toastMessage('复制成功!');
            })
        },
        getSummaryText() {
            let url = this.summaryList&&this.summaryList[0]
            this.$http.get(url)
                .then(res => {
                    this.summary = res.data
                })
                .catch(response => {
                    console.log(response);
                });
        }
    },
}
</script>

<style lang="less" scoped>
.summary-container{
    width: 100%;
    height: 100%;
    position: relative;
    .header{
        width: 90%;
        height: 13%;
        margin: 0 auto;
        border-bottom: 1px solid #F2F2F2;
        display: flex;
        justify-content: space-around;
        align-items: center;
        .header-title{
            width: 100px;
            height: 100%;
            flex:1;
            display: flex;
            justify-content: center;
            align-items: center;
            font-weight: 600;
            font-size: 38px;
            color: #000000;
            padding-left: 40px;
        }
        .close-icon{
            width: 48px;
            height: 48px;
            background: url('../../../assets/images/report_close.png') no-repeat;
            background-size: 48px 48px;
        }
    }
    .summary-content{
        width: 100%;
        height: 67%;
        margin-top: 50px;
        .summary{
            width: 80%;
            height: 100%;
            font-weight: 400;
            color: #333333;
            line-height: 40px;
            font-size: 30px;
            overflow-y: scroll;
            margin: 0 auto;
            white-space:pre-wrap;
        }
    }
    .footer{
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 13%;
        display: flex;
        justify-content: center;
        align-items: center;
        .footer-word{
            width: 200px;
            height: 50px;
            line-height: 50px;
            display: flex;
            font-size: 30px;
            font-weight: 600;
            color: #FF3D00;
            .footer-icon{
                width: 48px;
                height: 48px;
                background: url('../../../assets/images/copyIcon.png') no-repeat;
                background-size: 48px 48px;
                margin-right: 10px;
            }
        }
    }
}
</style>